<template>
  <div class="all">
    <header>
      <div class="div">
        <img src="../../assets/返回.png" @click="back()" alt="">
        <span class="solid" @click="back()">返回</span>
      </div>
      <div class="div">
        <span>问诊人资料</span>
      </div>
      <div class="div">
      </div>
    </header>
    <div class="label">
      <a class="hengGang"></a>问诊人描述病情
    </div>
    <div class="textBox">
      <textarea v-model="illness_desc" name="" id="" cols="30" rows="10"></textarea>
    </div>
    <ul class="ulList">
      <li >
        <span class="li_label">被服务人信息</span>
        <span class="li_input">
            <input type="text" v-model="PATIENT_NAME" readonly placeholder="请选择被服务人">
        </span>
      </li>
      <li >
        <span class="li_label">是否需要医生指导用药</span>
        <span class="li_input" v-show="is_doc_medical == 0">
          否
        </span>
        <span class="li_input" v-show="is_doc_medical == 1">
          是
        </span>
      </li>
      <li v-show="isYoung == true">
        <span class="li_label">体重</span>
        <span class="li_input">
            <input type="text" v-model="weight" placeholder="请输入体重">
            kg
          </span>
      </li>
      <li>
        <span class="li_label">是否曾到医疗机构就诊</span>
        <span class="li_input" v-show="is_hos_visit == 0">
          否
        </span>
        <span class="li_input" v-show="is_hos_visit == 1">
          是
        </span>
<!--        <span class="li_input">-->
<!--            <input type="text" v-model="hospitalText"  readonly placeholder="请选择是或否">-->
<!--          </span>-->
      </li>
    </ul>
    <div class="label">
      <a class="hengGang"></a>病患处照片
    </div>
    <div style="background: #fff;padding: 10px;box-sizing: border-box">
      <van-uploader v-model="fileList"
                    :max-count="maxCount"
                    :upload-icon="require('../../assets/上传图片.png')"
                    multiple="true"
                    :deletable="false"
                    image-fit="cover"
                    accept="image/*"
                    preview-size="28vw"
      />
    </div>

  </div>
</template>

<script>
export default {
  name: 'PatientInformation',
  data () {
    return {
      illness_desc: '', // 病情描述
      is_doc_medical: '', // 是否需要医生指导用药
      is_hos_visit: '', // 是否去过医院检查
      PATIENT_NAME: '', // 患者姓名
      weight: '', // 年龄小于6岁需要展示体重
      isYoung: false,
      id: this.$route.query.id,
      fileList: [],
      maxCount: 0
    }
  },
  mounted () {
    this.getData()
  },
  methods: {
    // 获取数据
    getData () {
      this.$http.findOneInquiry({
        id: this.id
      })
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            this.doc_amount_duration = res.data.data.doc_amount_duration
            this.illness_desc = res.data.data.illness_desc
            if (res.data.data.age < 6) {
              this.isYoung = true
            } else {
              this.isYoung = false
            }
            this.weight = res.data.data.weight
            this.PATIENT_NAME = res.data.data.PATIENT_NAME
            this.fileList = []
            for (var i = 0; i < res.data.data.Iimg.length; i++) {
              var file = { url: res.data.data.Iimg[i].img_url, isImage: true }
              this.fileList.push(file)
              // imgList.push(res.data.data.Iimg[i].img_url)
            }
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 返回
    back () {
      // this.$router.push({path: '/'})
      this.$router.history.go(-1)
    }
  }
}
</script>

<style scoped>
.all{
  width: 100%;
  height: 100%;
  background: #FAF9FE;
  overflow: auto;
}
header{
  width: 100%;
  height: 44px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #E5E5E5;
  background: white;
  position: sticky;
  top: 0;
  z-index: 9;
}
.div{
  width: 33%;
  height: 100%;
  display: flex;
  align-items: center;
  font-family: "PingFang SC";
  font-size: 15px;
  font-weight: bold;
}
.div img{
  margin-right: 5px;
}
.div:nth-child(1) img{
  height: 13px;
  width: 7px;
  margin-left: 15px;
}
.div:nth-child(3) img{
  margin-right: 5px;
}
.div:nth-child(3) span{
  margin-right: 15px;
}
.div:nth-child(2){
  justify-content: center;
}
.div:nth-child(3){
  justify-content: flex-end;
}
.solid{
  color: #1DA4F2;
}
.label{
  height: 44px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  box-sizing: border-box;
  font-size: 15px;
  font-family: PingFang SC;
  font-weight: bold;
  background: white;
}
.hengGang{
  display: block;
  width: 2px;
  border-radius: 1px;
  height: 15px;
  background: #1DA4F2;
  margin-right: 5px;
}
.textBox{
  width: 100%;
  height: 150px;
  background: white;
  padding: 10px 0;
  box-sizing: border-box;
}
.textBox textarea{
  width: 95%;
  height: 100%;
  resize: none;
  border-radius: 10px;
  padding: 10px ;
  box-sizing: border-box;
  background: #FAF9FE;
  margin: 0 2%;
  border: none;
  font-size: 15px;
}
.ulList{
  width: 100%;
  background: white;
  padding:  0 15px;
  box-sizing: border-box;
}
.ulList li{
  width: 100%;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #E5E5E5;
}
.li_label{
  font-size: 15px;
  font-family: PingFang SC;
  font-weight: 500;
  color: #333333;
}
.li_input img{
  width: 13px;
  height: 7px;
}
.li_input input{
  /*width: 110px;*/
  text-align: right;
  border: none;
  font-size: 15px;
}
.textDiv{
  width: 100%;
  background: white;
}
textarea{
  width: 95%;
  height: 130px;
  resize: none;
  background: #FAF9FE;
  border-radius: 10px;
  border: none;
  margin: 0 2%;
  padding: 10px;
  box-sizing: border-box;

  font-size: 13px;
  font-family: PingFang SC;
  font-weight: 500;
  color: #999999;
}
</style>
